<template>
  <view class="shop" :class="isPadding && 'pd30'">
    <view class="shop_list" v-for="item, indexs in list" :key="indexs">
      <u-image src="@/static/tabs/buku2.png" radius="10px" :lazy-load="true" width="172rpx" height="172rpx"
        mode="aspectFit"></u-image>
      <view class="shop_right">
        <view class="shop_right_title">{{ item.name }}</view>
        <u-line-progress :percentage="item.value" v-if="item.status != 2" height="12rpx" activeColor="#FF4201"
          inactiveColor="#FFE6B6" :showText="false"></u-line-progress>
        <!--  -->
        <button class="shop_right_btn" open-type="share" v-if="item.status == 1">去发福袋</button>
        <view v-else class="shop_wancheng">
          <view class="flex" @click="nextPage">{{ statusList[item.status - 2] }}
            <u-icon name="arrow-right" size="13"></u-icon>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>
<script setup lang="ts">
/***   分享组件 BshareLiist
  @param{
    isPadding bool 是否显示 
  }
 */
import { ref, reactive } from 'vue'
import { onShow, onHide, onShareAppMessage } from "@dcloudio/uni-app";

export interface Props {
  isPadding?: boolean,
  list?: any
}

const props = withDefaults(defineProps<Props>(), {
  isPadding: true,
  list: [
    {
      name: '已分享123个福袋，仅差30个免单',
      status: 1,
      value: 80
    },
    {
      name: '审核中',
      status: 2
    },
    {
      name: '已免单',
      status: 3,
      value: 100
    },
    {
      name: '待免单',
      status: 4,
      value: 20
    }
  ]
})
const statusList = reactive(['去查看', '已免单', '待免单'])
const emit = defineEmits({})
function onShare() {
  emit('share')
}

function nextPage() {
  uni.navigateTo({
    url: '../../subPage/share/index'
  })
}
</script>
<style lang="scss" scoped>
@import './BshareList.scss'
</style>